<!DOCTYPE html>
<html lang="ch">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="../css/repeat.css">
    <link rel="stylesheet" href="../css/login.css">
    <link rel="stylesheet" href="../img/iconfont/iconfont.css">
    <script src="../js/login.js" type="module"></script>
    <title>登录</title>
</head>
<body>
    <!-- 左侧背景图 -->
    <div class="login_bg"><img src="../img/login_bg.jpg" alt=""></div>
    <main>
        <!-- 顶部logo和帮助 -->
        <header>
            <h2><img src="../img/logo-mi2.png"><span>小米账号</span></h2>
            <ul id="help">
                <li><a href="">用户协议</a></li>
                <li><a href="">隐私政策</a></li>
                <li><a href="">帮助中心</a></li>
                <em>&nbsp</em>
                <li>
                    <a href="">中文(简体)<i></i></a>
                    <dl>
                        <dd><a href="">中文(繁体)</a></dd>
                        <dd><a href="">English</a></dd>
                    </dl>
                </li>
            </ul>
        </header>
        <!-- 登录/注册窗 -->
        <div id="loginbar">
            <div id="type_toggle"><span class="iconfont icon-gouwuchekong"></span><div class="title">扫码登录</div></div>
            <div id="login_toggle"><a href="" class="">登录</a><a href="" class="">注册</a><i class="right"></i></div>
            <!-- 登录页表单 -->
            <form action="#" id="login" class="none">
                <div class="username">
                    <input type="text" name="username">
                    <span>邮箱/手机号/小米ID</span>
                    <p>请输入帐号</p>
                </div>
                <div class="paseword">
                    <input type="paseword" name="paseword">
                    <span>密码</span>
                    <span class="iconfont icon-gouwuchekong"></span>
                    <p>请输入登录密码</p>
                </div>
                <input type="submit" id="login_btn" value="登录">
                <p><a href="">忘记密码？</a><a href="">手机号登录</a></p>
            </form>
            <!-- 注册页表单 -->
            <form id="register" class="none">
                <div class="addr">
                    <select name="addr" id="addr">
                        <option value="0">中国</option>
                    </select>
                    <div class="title"><span class="iconfont icon-gouwuchekong"></span><span>系统会根据您选择的国家/地区的法律法规存储您的个人信息</span></div>
                    <span>国家/地区</span>
                    <span class="iconfont icon-gouwuchekong"></span>
                </div>
                <div class="phone">
                    <div id="phone_form">
                        <div class="prefix">
                            <select name="prefix" id="prefix">
                                <option value="86">+86</option>
                            </select>
                            <span>国家码</span>
                            <span class="iconfont icon-gouwuchekong"></span>
                        </div>
                        <div class="phone_number">
                            <input type="text" name="phone" id="phone_number">
                            <span>手机号</span>
                        </div>
                    </div>
                    <p class="none" id="phoneNone">请输入手机号码</p>
                    <p class="none" id="phoneTypeErr">手机号格式不正确</p>
                </div>
                <div class="code">
                    <input type="text" name="code" id="code">
                    <span>密码</span>
                    <a href="">获取密码</a>
                    <p class="none" id="codeNone">请输入密码</p>
                </div>
                <input type="button" id="register_btn" value="注册">
                <p><a href="">收不到验证码？</a></p>
                <span id="agree"><i class="iconfont icon-gouwuchekong"></i>已阅读并同意小米帐号 <a href=""> 用户协议 </a> 和 <a href=""> 隐私政策 </a></span>
            </form>
            <dl id="more_type">
                <dt>其他方式登录</dt>
                <dd><a href=""><span class="iconfont icon-gouwuchekong"></span></a></dd>
                <dd><a href=""><span class="iconfont icon-gouwuchekong"></span></a></dd>
                <dd><a href=""><span class="iconfont icon-gouwuchekong"></span></a></dd>
                <dd><a href=""><span class="iconfont icon-gouwuchekong"></span></a></dd>
            </dl>
        </div>
        <!-- 备案信息 -->
        <p>小米公司版权所有-京ICP备<a href="">10046444-京公网安备11010802020134号</a>-京ICP证110507号</p>
    </main>
</body>
</html>